<!--
 * @Description: 数字输入
-->
<template>
  <div class="cpt_grey_disabled" v-if="disabled">{{ value }}</div>
  <el-input-number
    v-else
    class="_ehl_input_number"
    @change="
      val => {
        $emit('input', !isEmpty(val) ? Number(val.toString().replace(/[^\d]/g, '')) : '')
        $emit('change', !isEmpty(val) ? Number(val.toString().replace(/[^\d]/g, '')) : '')
      }
    "
    :min="Number(min)"
    :max="Number(max)"
    :placeholder="placeholder"
    :value="Number(value)"
    :disabled="disabled"
    :step="Number(step)"
    :precision="Number(precision)"
    controls-position="right"
  >
  </el-input-number>
</template>
<script>
  import Vue from 'vue'
  import { InputNumber } from 'element-ui'
  Vue.use(InputNumber)
  export default {
    props: {
      value: { type: [String, Number], default: () => null },
      disabled: { type: Boolean, default: () => false },
      min: { type: [String, Number], default: () => 0 },
      max: { type: [String, Number], default: () => 50 },
      step: { type: [String, Number], default: () => 1 },
      placeholder: { type: String, default: () => '请输入' },
      precision: { type: [String, Number], default: () => 0 },
    },
    methods: {
      isEmpty(str) {
        return isEmpty(str)
      },
    },
  }
</script>
